<template>
    <div>
        <!-- 搜索 -->
        <TopFilter ref="TopFilterss" :list="topFilterInit" :cols="3" :collapse="collapse" labelWidth="110"
            @filterChange="changeHandle"></TopFilter>
        <!-- table -->
        <FilterTable ref="table" :columns="columns" :params="fetchParams" :fetchapi="fetchapi" :datakey="'records'"
            :selectionType="selectionType" :onColumnsChange="(columns) => (this.columns = columns)"
            :onRowSelectChange="selectChange" height="auto">
        </FilterTable>
        <div style="padding-top: 3rem"></div>
        <div :style="{
            position: 'absolute',
            left: 0,
            bottom: 0,
            right: 0,
            zIndex: 9,
            borderTop: '1px solid #e9e9e9',
            padding: '10px 20px',
            background: '#fff',
            textAlign: 'right',
        }">
            <multiuse-button type="primary" :click="saveDialog.bind()" :disabled="disableds">确 认</multiuse-button>
            <multiuse-button @click="closeDialog">关 闭</multiuse-button>
        </div>
    </div>
</template>
<script>
import { getSupplierList } from '@/api/dictionary';
import { getAppId } from '@/assets/js/auth';
import { dictionary } from '@/utils/dictMixin';
export default {
    props:{
    selectionType: {
      type: String,
      default: 'single'
    },
    rowDate:{
      type: Object,
    }
  },
    mixins: [dictionary],
    data() {
        return {
            disableds: true,
            dataList: [],
            visible: false,
            visibleDrawer: false,
            collapse: false,
            infoId: null,
            topFilterInit: this.topFilterInitFun(),
            flterValue: {}, //参数
            columns: this.creatHeader(),
            fetchParams: {
                appId: getAppId(),
                id: this.rowDate == undefined ? "" : this.rowDate.partId,
            }, //ipa 接口
            selectedRows: [], //选中经销商
            dialogTitle: '选择车辆',
            visibleAdd: false,
            fetchapi: getSupplierList,
        };
    },
    methods: {
        created() {
            console.log("#!@#!@#!", this.rowDate)
        },
        saveDialog() {
            this.$emit('save', this.selectedRows);
        },
        closeDialog() {
            this.$emit('close');
        },
        //选中
        selectChange(rows) {
            this.selectedRows = [...rows];
            this.selectedRows.map(x => {
                x.supCode = x.bjgybm;
                x.supId = x.id;
                x.supName = x.bjgyjc;
            })
            this.disableds = this.selectedRows.length <= 0;
        },
        //搜索获取数据
        changeHandle(val) {
            this.fetchParams = Object.assign({}, val, {
                appId: getAppId()
            });
        },
        //搜索数据
        topFilterInitFun() {
            return [
                { type: 'INPUT', label: '供应商代码', fieldName: 'bjgybm', placeholder: '请输入供应商代码...', initialValue: '' },
                { type: 'INPUT', label: '供应商名称', fieldName: 'bjgyjc', placeholder: '请输入供应商名称...', initialValue: '' },
                { type: 'INPUT', label: '备件代码', fieldName: 'bjxmbh', placeholder: '请输入备件代码...', initialValue: '' },
                // { type: 'SELECT', label: '动力形式', fieldName: 'bjpjsx', placeholder: '请输入动力形式...', initialValue: '', itemList:this.createDictList('5000') },
            ];
        },
        //table表头和数据源
        creatHeader() {
            return [
                {
                    title: '序号',
                    dataIndex: 'index',
                    width: 80,
                    sorter: true,
                    render: (props) => {
                        return <span>{props.row.index + 1}</span>;
                    },
                },
                { title: '供应商代码', dataIndex: 'bjgybm', sorter: true },
                // { title: '供应商简称', dataIndex: 'id', sorter: true },
                { title: '供应商名称', dataIndex: 'bjgyjc', sorter: true },
                // { title: '供应商代码', dataIndex: 'supCode', sorter: true },
                // { title: '供应商简称', dataIndex: 'supId', sorter: true },
                // { title: '供应商名称', dataIndex: 'supName', sorter: true },
            ];
        },
    },
};
</script>

<style lang="less" scoped>

</style>
